/** @jsxImportSource @emotion/react */
import * as React from "react";
import {
    BlobInputList, CCell, Cell, InputLine, LineColumn, Table, TableBody, TableRow, Text, TextArea,
} from "customize-easy-ui-component";
import {InspectRecordLayout, InternalItemProps, RepLink, useItemInputControl,} from "../../common/base";
import {useMeasureInpFilter} from "../../common/hooks";
import {TailMenRowIspCheck} from "../../contain/rarelyVary";
import {usePrefixDataEdit, usePrefixDataTable} from "../../hook/usePrefixData";

interface Props  extends InternalItemProps{
    label?: string;
    titles?: any[];
}
const config资料审查 = [
         //管道编号?? =>单位内部编号;
    [['管道名称', '_$管道设备名'], ['管道编号','_$单位内部编号'], ],
    [['起始位置', '起始位'], ['管道级别', '管道级'],],
    //和结论概况页的 重名：
    [['终止位置', '终止位'], ['投用日期', {n:'投用日',t:'l',l:["见管道特性表"]}], ],
                //单位 ”m“？
    [['工作介质', {n: '工作介', t: 'l', l: ["见管道特性表"]}], ['管道长度', {n: '管道长', u: 'km'}]],
    [['设计压力', {n: '设压力', u: 'MPa', t: 'l', l: ["见管道特性表"]}], ['操作压力', {n: '操压力', u: 'MPa', t: 'l', l: ["见管道特性表"]}] ],
    [['设计温度', {n: '设计温', u: '℃', t: 'l', l: ["见管道特性表"]}], ['操作温度', {n: '操温度', u: '℃', t: 'l', l: ["见管道特性表"]}] ],
    [['管道材质', {n: '管材质', t: 'l', l: ["见管道特性表"]}], ['管道规格(外径x壁厚)', {n: '管规格', t: 'l', l: ["见管道特性表"],u:'mm'},],],
    [['防腐层材料', '防腐材'], ['防腐层沥青等级', '沥青级'],],
    [['上次全面检验日期', {n:'上全检日',t:'d'}], ['上次全面检验报告号', '上全检报',], ],
];
//单纯用于验证存储的唯一性：扣除（config设备概况）
export const config资料审查补 = [
    [['起始位置', '起始位'], ['管道级别', '管道级'],],
    [['终止位置', '终止位'],  ],
    [['工作介质', {n: '工作介', t: 'l', l: ["见管道特性表"]}], ],
    [['防腐层材料', '防腐材'], ['防腐层沥青等级', '沥青级'],],
    [['上次全面检验日期', {n:'上全检日',t:'d'}], ['上次全面检验报告号', '上全检报',], ],
];

const sel竣工验=['齐全','部分缺失','无资料'];
const sel安装督=['齐全','部分缺失','无监检'];
const sel定检记=['齐全','部分缺失','首次检验'];
export const sel有无=['有','无'];
const sel上岗证=['证件齐全','证件过期','部分无证上岗','无证上岗'];
const sel运行维=['齐全','部分缺失','无资料'];
const sel治理记=['齐全','部分缺失','无此项'];
//两层的(嵌套的配置)
const items资料=[
    ['技术档案资料',[ ['竣验收','(1)设计和安装、改造、维修等施工、竣工验收资料',sel竣工验],
        ['监督检','(2)安装监督检验记录',sel安装督],
        ['定期检','(3)定期检验记录',sel定检记]
    ] ],
    ['安全管理资料',[ ['使登记','(1)使用登记证',sel有无],
        ['管理制','(2)安全管理制度与安全操作规则',sel有无],
        ['人持证','(3)作业人员持证上岗情况',sel上岗证]
    ] ],
    ['运行状况资料',[ ['日常运','(1)日常运行维护记录',sel运行维],
        ['隐患排','(2)隐患排查治理记录',sel治理记],
        ['维修记','(3)改造维修记录',sel治理记],
        ['事故记','(4)故障与事故记录',sel治理记],
        ['介质分','(5)介质组分分析报告',sel运行维]
    ] ],
];
export const itemA查材料: string[]=['审查问题'];
for(let part of items资料){
    let confs=part[1] as any[];
    confs.forEach((item, w) => {
        itemA查材料.push(item[0]);
    });
}
//原pdf? 打勾的：可以多选的做法：
export const MaterialReview=
    React.forwardRef((
        { children, show ,alone=true,redId,nestMd,label}:InternalItemProps,  ref
    ) => {
        const {inp, setInp} = useItemInputControl({ref});
        const [renderEditor, itemA审查概况] = usePrefixDataEdit({inp, setInp, config: config资料审查,  });
        const itemA = React.useMemo(() => {
            return [...itemA查材料,  ...itemA审查概况 ];
        }, [itemA审查概况]);
        const [getInpFilter] = useMeasureInpFilter(null, itemA, );
        return <InspectRecordLayout inp={inp} setInp={setInp} getInpFilter={getInpFilter} show={show} redId={redId}
                                    nestMd={nestMd} alone={alone} label={label!}>
            <Text variant="h5">{label}：</Text>
            资料审查设备概况除在台账业务信息中可修改外还需修改的部分:
            {renderEditor}
            {items资料.map((part: any, a:number) =>
                <div key={a}>
                    <Text variant='h5'>{part[0]}</Text>
                    <LineColumn column={6}>
                        {part[1].map((item: any, w:number) =>
                            <InputLine key={w} label={item[1]}>
                                <BlobInputList value={inp?.[item[0]] ||''}  rows={1}  datalist={item[2]}
                                               onListChange={v => setInp({...inp, [item[0]]: v || undefined})}/>
                            </InputLine>
                        )}
                    </LineColumn>
                </div>
            )}
            <Text variant="h5">资料审查问题记载：</Text>
            <TextArea value={inp?.审查问题 || ''} rows={7}
                      onChange={e => setInp({...inp, 审查问题: e.currentTarget.value || undefined})}/>
            { children }
        </InspectRecordLayout>;
});

const config审查r = config资料审查.slice(0, 8);
export const MaterialReviewVw = ({orc, rep,op}: {orc: any, rep: any,op?:boolean }
) => {
    //const [renderUpper, _S] = useThreeColumnView({orc, config: config资料审查, slash: true,});
    const renderUpper = usePrefixDataTable({config: op? config资料审查:config审查r, orc, rep, slash: true});
    return <>
        <div css={{"@media print": {paddingBottom: '4rem', pageBreakInside: 'avoid'}}}>
            <Text id='MaterialReview' variant="h2" css={{
                textAlign: 'center', marginTop: '1rem',
            }}>资料审查{op?'记录':'报告'}</Text>
            <div css={{
                display: 'flex',
                justifyContent: 'space-between'
            }}>
                <Text></Text>
                <Text>{op?'记录':'报告'}编号：{rep.isp.no}</Text>
            </div>
        </div>
        <Table fixed={ ["8%", "8.1%", "37%", "8.2%", "10%", "%"] } tight miniw={800}
               css={{borderCollapse: 'collapse', "@media print": {marginTop: '-4rem'}}}>
            <TableBody>
                <RepLink rep={rep} tag={'MaterialReview'}>
                    {renderUpper}
                </RepLink>
            </TableBody>
        </Table>
        <Table fixed={ ["9%", "4%", "43%", "%"] } css={{borderCollapse: 'collapse'}} tight miniw={800}>
            <TableBody>
                <RepLink rep={rep} tag={'MaterialReview'}>
                    {items资料.map((part: any, a:number) => <React.Fragment key={a}>
                        {part[1].map((item: any, w:number) => <TableRow key={w}>
                            { 0===w && <CCell colSpan={2} rowSpan={part[1].length}>{part[0]}</CCell>
                            }
                            <CCell>{item[1]}</CCell>
                            <CCell>{orc?.[item[0]] || '／'}</CCell>
                          </TableRow>
                        )}
                      </React.Fragment>
                    )}
                    <TableRow>
                        <CCell>资料审查问题记载</CCell>
                        <Cell split={true} colSpan={3}>
                            <div css={{minHeight: '2rem', whiteSpace: 'pre-wrap'}}>
                                {orc.审查问题 || '／'}
                            </div>
                        </Cell>
                    </TableRow>
                </RepLink>
            </TableBody>
        </Table>
        <TailMenRowIspCheck  orc={orc} rep={rep} cap='检查' href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/ProjectList#ProjectList`}/>
    </>;
};
